/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import './index.scss';

interface IConProps {
	style?: React.CSSProperties;
}

export function Logo() {
	return (
		<span title="taier" style={{ fontSize: 20, display: 'flex' }}>
			<svg height="24" viewBox="0 0 500 500">
				<g fill="none" fillRule="evenodd" stroke="none" strokeWidth="1">
					<g transform="translate(33)">
						<path
							fill="#0072FB"
							d="M435 374.999192L435 125.000808 217.5 0 0 125.000808 0 374.999192 217.5 500z"
						/>
						<g transform="translate(41.649 64.22)">
							<path
								fill="#FFF"
								d="M122.774924 161.399833L0 161.399833 75.6007706 80.8809741 122.774924 80.8809741z"
							/>
							<path
								fill="#FFF"
								d="M277.963727 161.270183L155.253763 161.270183 229.474128 81.4529218 353.106527 80.5670333z"
							/>
							<path
								fill="#7FB7FF"
								d="M122.774924 80.8809741L122.774924 161.270506 199.048033 81.8961894 199.541731 0z"
							/>
							<path
								fill="#7FB7FF"
								d="M278.035172 290.890868L122.774924 290.890868 200.23031 372.515471z"
							/>
							<path
								fill="#FFF"
								d="M122.775249 290.890868L122.775249 182.095999 200.188411 182.095999 200.188411 372.038255z"
							/>
						</g>
					</g>
				</g>
			</svg>
		</span>
	);
}

export const SparkSQLIcon = ({ style }: IConProps) => {
	return (
		<span title="SparkSQL" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				className="icon"
				height="1em"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M896 0a42.667 42.667 0 0142.667 42.667v896A42.667 42.667 0 01896 981.333H128a42.667 42.667 0 01-42.667-42.666v-896A42.667 42.667 0 01128 0h768zm0 42.667H128v896h768v-896zM396.373 563.37c49.451-.043 80.342 17.792 80.342 85.973 0 47.488-12.288 68.267-37.12 80.085L470.57 768h-58.752L393.3 735.403c-49.493-2.987-77.312-20.779-77.312-86.059 0-68.181 30.891-85.973 80.384-85.973zM238.08 579.627c18.944 0 30.72 2.304 39.68 4.821l3.584 1.11v38.527a191.36 191.36 0 00-43.264-5.888c-15.445 0-21.675 2.987-21.675 11.862 0 8.917 3.115 8.917 24.747 14.805 43.307 11.904 49.493 23.765 49.493 53.376 0 35.627-18.56 53.419-71.125 53.419-15.445 0-30.89-2.006-42.795-4.48l-6.656-1.451v-41.515c12.374 2.987 30.891 5.931 46.379 5.931 21.675 0 24.747-5.973 24.747-14.805 0-5.974-3.115-8.96-24.747-14.891-37.12-5.888-46.379-17.792-46.379-50.39 0-38.57 27.862-50.431 68.011-50.431zm317.44 2.986V707.2h64.939v41.515h-114.39V582.613h49.408zm-159.147 22.272c-21.632 0-27.818 11.819-27.818 47.446 0 32.597 3.072 44.501 27.818 44.501 24.747 0 27.819-11.904 27.819-44.501 0-35.584-6.23-47.446-27.819-47.446zM504.576 171.82c12.373 2.986 21.632 5.973 27.819 14.848l89.685 97.92 136.021-17.792c24.747-2.987 49.494 14.848 52.608 41.514 0 11.904 0 20.779-6.186 29.696l-68.054 109.696 55.68 115.627c9.259 23.765 0 50.517-24.746 62.293-9.302 2.987-21.632 5.974-30.934 2.987l-139.136-32.64c-3.072 0-3.072-2.987-3.072-5.973l6.059-31.744c0-2.987 3.157-2.987 6.23-2.987l151.509 29.184-68.182-136.79 77.483-134.314-160.81 24.619L497.663 222.08l-32.213 145.579-138.539 55.594 125.568 67.414c3.03 2.986 6.144 5.973 3.03 8.874l-22.017 34.134c-3.114 2.986-6.229 5.973-9.301 2.986l-123.648-68.224c-24.704-11.904-33.963-41.514-24.704-65.28 6.144-8.874 15.445-17.792 24.704-20.736l120.533-50.346 24.747-124.672a49.835 49.835 0 0158.752-35.584z"
				/>
			</svg>
		</span>
	);
};

export const HiveSQLIcon = ({ style }: IConProps) => {
	return (
		<span title="SparkSQL" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M700.239 742.312h-61.098V530.606H400.95v213.13h-61.098v-473.95h61.098V475.46h238.441V269.787h60.847z"
				/>
				<path
					fill="currentColor"
					d="M815.311 1024H208.69A209.527 209.527 0 010 815.311V208.69A209.527 209.527 0 01208.689 0H815.31A209.527 209.527 0 011024 208.689V815.31A209.527 209.527 0 01815.311 1024zM208.69 59.59a149.518 149.518 0 00-149.1 149.099V815.31a149.518 149.518 0 00149.1 149.016H815.31A149.518 149.518 0 00964.327 815.31V208.69a149.518 149.518 0 00-149.016-149.1z"
				/>
			</svg>
		</span>
	);
};

export const FlinkSQLIcon = ({ style }: IConProps) => {
	return (
		<span title="FlinkSQL" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M521.8 520.7c-33.4 0-53.8 29-53.8 78 0 52.8 20.4 83.2 53.8 83.2s54.2-30.3 54.2-83.2c0-49.1-20.8-78-54.2-78z"
				/>
				<path
					fill="currentColor"
					d="M912.8 441.5h-47.2V253.4L677.1 65.3H252.6c-52.1 0-94.3 42.1-94.3 94v282.1h-47.2c-26 0-47.2 21.1-47.2 47v282.1c0 26 21.1 47 47.2 47h47.2v47c0 51.9 42.2 94 94.3 94h518.7c52.1 0 94.3-42.1 94.3-94v-47h47.2c26 0 47.2-21 47.2-47v-282c0-26-21.1-47-47.2-47zM205.5 159.3c0-26 21.1-47 47.2-47H630v94.1c0 51.9 42.2 94 94.3 94h94.3v141.1H205.5V159.3zm407.6 591c10.9 0 20.8-2 28.6-4.8l10.6 44.3c-9.5 5.1-25.9 8.5-46 8.5-55.2 0-93.7-29-112.1-69.5-53.8-11.9-88.6-58.6-88.6-130.2 0-83.2 47-130.2 116.2-130.2S638 515.8 638 598.6c0 67.5-31 113.1-79.7 127.8 11.5 17.5 34.4 23.9 54.8 23.9zM363 579.3v50.8h-86.6v96.8h-61V473.3h161.9v50.4H276.4v55.5H363zm455.5 285.4c0 26-21.1 47-47.2 47H252.6c-26 0-47.2-21.1-47.2-47v-47h613.1v47zm26-137.9H685V473.3h61v202.4h98.5v51.1z"
				/>
			</svg>
		</span>
	);
};
export const DataCollectionIcon = ({ style }: IConProps) => {
	return (
		<span title="实时采集" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M960 0a64 64 0 0 1 64 64v896a64 64 0 0 1-64 64H64a64 64 0 0 1-64-64V64a64 64 0 0 1 64-64h896z m0 64H64v896h896V64z m-222.4 110.4C830.592 174.4 896 330.304 896 519.232c0 188.864-65.408 344.768-158.4 344.768-41.984 0-78.528-31.616-106.112-85.12a26.624 26.624 0 0 1 0.704-25.6 24.128 24.128 0 0 1 21.44-12.096 24.32 24.32 0 0 1 20.736 13.44c19.968 38.72 42.624 58.24 63.232 58.24 55.104 0 109.632-129.92 109.632-293.632 0-163.712-54.528-293.76-109.632-293.76-19.968 0-41.92 18.432-61.44 55.04a23.808 23.808 0 0 1-33.088 9.6 26.24 26.24 0 0 1-9.472-34.56c27.264-51.072 63.104-81.152 104-81.152z m26.304 488.64c12.928 0 23.552 10.56 24.32 24.064a25.216 25.216 0 0 1-21.44 26.88l-2.88 0.128H575.36l-171.584 73.408a23.488 23.488 0 0 1-6.08 1.664l-3.136 0.192h-100.48c-13.568 41.28-53.632 66.304-94.72 59.072C158.208 841.28 128 804.032 128 760.384c0-45.12 32-83.2 74.688-88.832 42.752-5.632 82.752 23.04 93.312 66.752h93.696L561.28 664.96a23.488 23.488 0 0 1 6.08-1.728l3.2-0.192h193.344z m-550.592 59.008a36.288 36.288 0 0 0-31.68 19.2 39.936 39.936 0 0 0 0 38.272c6.528 11.84 18.624 19.2 31.68 19.2a37.44 37.44 0 0 0 36.544-38.4 37.44 37.44 0 0 0-36.544-38.272z m170.56-204.352c22.4 0 43.008 12.8 53.632 33.472h326.4a24.896 24.896 0 0 1 24.512 24.064 25.216 25.216 0 0 1-21.632 26.88l-2.88 0.128H441.6c-10.048 30.848-40.64 48.832-70.976 41.728-30.336-7.104-50.688-36.992-47.296-69.376 3.456-32.384 29.568-56.896 60.608-56.896zM295.808 226.88h116.48c59.136 0 110.976 41.472 126.656 101.248h224.96a24.896 24.896 0 0 1 24.512 24 25.216 25.216 0 0 1-21.632 26.88l-2.88 0.192h-215.04c11.904 31.232 40 52.352 72.064 54.208l4.544 0.128h138.432a24.896 24.896 0 0 1 24.512 24.064 25.216 25.216 0 0 1-21.632 26.88l-2.88 0.192H625.472c-60.672 0-113.472-43.584-127.68-105.472h-58.88a60.16 60.16 0 0 1-69.44 34.56c-28.032-7.168-47.36-33.92-46.464-64.192 0.96-30.208 22.016-55.552 50.432-60.8a60.48 60.48 0 0 1 67.072 39.36h46.72a82.688 82.688 0 0 0-70.4-50.048l-4.544-0.128H294.208c-13.376 41.472-53.376 66.688-94.592 59.648C158.4 330.56 128.128 293.312 128 249.6c-0.064-44.992 31.808-83.008 74.368-88.768 42.624-5.76 82.624 22.528 93.44 66.112zM213.312 211.2a36.288 36.288 0 0 0-31.68 19.136 39.936 39.936 0 0 0 0 38.336c6.528 11.84 18.624 19.136 31.68 19.136a37.44 37.44 0 0 0 36.544-38.336 37.44 37.44 0 0 0-36.544-38.272z"
				/>
			</svg>
		</span>
	);
};

export const ComponentConfigIcon = ({ style }: IConProps) => {
	return (
		<span title="组件配置" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M894.336 223.04L523.648 113.664a38.72 38.72 0 00-21.504-.192l-351.232 102.4a30.464 30.464 0 00-13.44 3.84l-6.592 1.92a38.208 38.208 0 00-27.648 36.8l-1.024 474.752c0 16 9.792 30.336 24.768 36.032l370.496 140.096a38.464 38.464 0 0027.008 0L896 770.432a38.336 38.336 0 0024.96-35.84l.832-474.496a38.464 38.464 0 00-27.456-37.12zm-365.12-45.44l216.064 63.68c7.168 2.048 7.168 12.288.192 14.528l-215.68 68.416a58.816 58.816 0 01-35.584 0L279.36 254.976c-7.168-2.24-6.976-12.48.192-14.528l216.896-63.104a61.44 61.44 0 0132.768.192zM185.344 287.488l284.672 91.52c7.168 2.24 12.096 9.024 12.096 16.64V814.4c0 12.16-12.096 20.48-23.552 16.192L173.248 722.688a17.536 17.536 0 01-11.264-16.384l.832-402.24a17.28 17.28 0 0122.528-16.64z"
				/>
			</svg>
		</span>
	);
};

export const ResourceIcon = ({ style }: IConProps) => {
	return (
		<span title="资源文件" style={{ ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M513.3 562.3c-10.3 0-20.6-2.6-29.9-7.9L249.2 436.3l-.9-.5c-18.6-11-29.6-30.5-29.6-52.1s11.1-41.1 29.6-52.1l1.5-.9 234.3-104.1c18.2-10 40.2-10 58.4 0l234.3 104.1 1.5.9c18.6 11 29.6 30.5 29.6 52.1s-11.1 41.1-29.6 52.1l-.9.5-234.2 118.1c-9.2 5.3-19.6 7.9-29.9 7.9zM278.6 384L512 501.7l.9.5c.2.1.5.1.7 0l.9-.5.9-.5L748 384c0-.1.1-.2.1-.4v-.2L515.2 279.9l-1.5-.9c-.2-.1-.5-.1-.7 0l-1.5.9-1.6.7-231.3 102.8v.6z"
				/>
				<path
					fill="currentColor"
					d="M513.3 684c-10.5 0-20.9-2.7-30.3-8.1L232.5 541.2l28.4-52.8 251.5 135.3.6.3c.2.1.5.1.7 0l1.1-.6L766.1 488l28.4 52.7-250.8 135.2c-9.4 5.4-19.9 8.1-30.4 8.1z"
				/>
				<path
					fill="currentColor"
					d="M513.3 807.4c-10.5 0-20.9-2.7-30.3-8.1L232.5 664.5l28.4-52.8L512.4 747l.6.3c.2.1.5.1.7 0l1.1-.6 251.3-135.3 28.4 52.7-250.8 135.1c-9.4 5.4-19.9 8.2-30.4 8.2zM216.1 514.4a30 30 0 1060 0 30 30 0 10-60 0zM750.3 514.4a30 30 0 1060 0 30 30 0 10-60 0z"
				/>
				<path
					fill="currentColor"
					d="M216.1 637.8a30 30 0 1060 0 30 30 0 10-60 0zM750.3 637.8a30 30 0 1060 0 30 30 0 10-60 0zM166.7 300.3h-68V196.7c0-54 44-98 98-98h103.4v68H196.7c-16.5 0-30 13.5-30 30v103.6zm133.4 627.4H196.7c-54 0-98-44-98-98V723.9h68v105.8c0 16.5 13.5 30 30 30h103.4v68zm529.6 0h-108v-68h108c16.5 0 30-13.5 30-30V723.9h68v105.8c0 54-44 98-98 98zm98-627.4h-68V196.7c0-16.5-13.5-30-30-30H724.1v-68h105.5c54 0 98 44 98 98v103.6h.1z"
				/>
			</svg>
		</span>
	);
};

export const CommonComponentIcon = ({ style }: IConProps) => {
	return (
		<span title="公共组件" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M631.04 237.632a34.432 34.432 0 0161.12-18.496 567.539 567.539 0 0039.488-16.128 376.96 376.96 0 00-185.216-68.48v116.864c28.544-2.432 56.768-7.04 84.608-13.76zm133.312 239.936h125.184a377.728 377.728 0 00-101.44-225.28 649.465 649.465 0 01-65.088 28.928c25.728 62.336 39.68 128.896 41.344 196.352zm-68.992 0a480.256 480.256 0 00-38.336-175.36 637.568 637.568 0 01-110.592 18.368v156.992H695.36zM604.672 879.68a379.392 379.392 0 00284.8-333.248h-127.68a549.504 549.504 0 01-157.12 333.248zm87.808-333.248H546.432v293.76a480.768 480.768 0 00146.048-293.76zM477.568 322.176a637.44 637.44 0 01-160.384-25.408 34.496 34.496 0 0119.392-66.176 567.68 567.68 0 00140.992 22.592v-118.72a379.136 379.136 0 00-343.04 343.04h343.04V322.24zm0 567.36v-343.04h-343.04a379.136 379.136 0 00343.04 343.04zM512 960a448 448 0 110-896 448 448 0 010 896z"
				/>
			</svg>
		</span>
	);
};

export const SchedulingComponentIcon = ({ style }: IConProps) => {
	return (
		<span title="资源调度组件" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M544.572 756.853c-20.66 0-37.561 16.906-37.561 37.565V920.1c0 20.66 16.901 37.56 37.561 37.56s37.564-16.9 37.564-37.56V794.419c0-20.66-16.905-37.566-37.564-37.566zM423.244 272.786l121.328-121.328L665.9 272.786c14.609 14.609 38.514 14.609 53.123 0 14.608-14.609 14.608-38.514 0-53.122L571.133 71.775c-14.609-14.609-38.514-14.609-53.123 0L370.121 219.664c-14.608 14.608-14.608 38.513 0 53.122 14.609 14.609 38.514 14.609 53.123 0zm526.918 369.005L802.273 493.902c-14.609-14.609-38.514-14.609-53.123 0-14.609 14.609-14.609 38.514 0 53.122l121.328 121.328L749.15 789.68c-14.609 14.608-14.609 38.513 0 53.122 14.609 14.609 38.514 14.609 53.123 0l147.889-147.889c14.608-14.609 14.608-38.513 0-53.122zm0 0"
				/>
				<path
					fill="currentColor"
					d="M507.011 251.686v283.449c0 20.66 16.901 37.56 37.561 37.56s37.564-16.9 37.564-37.56V251.686c0-20.66-16.904-37.561-37.564-37.561-20.66.001-37.561 16.902-37.561 37.561zM351.014 756.853c-20.66 0-37.564 16.906-37.564 37.565V920.1c0 20.66 16.904 37.56 37.564 37.56s37.561-16.9 37.561-37.56V794.419c-.001-20.66-16.902-37.566-37.561-37.566zm0 0"
				/>
				<path
					fill="currentColor"
					d="M751.186 705.352c20.66 0 37.564-16.904 37.564-37.564s-16.905-37.565-37.564-37.565H252.6c-62.236 0-112.69-50.45-112.69-112.689 0-62.236 50.454-112.69 112.69-112.69 62.239 0 112.689 50.454 112.689 112.69 0 20.745 16.82 37.564 37.565 37.564 20.745 0 37.564-16.819 37.564-37.564 0-103.726-84.088-187.815-187.818-187.815-103.726 0-187.815 84.089-187.815 187.815 0 103.73 84.089 187.818 187.815 187.818h498.586zm0 0"
				/>
			</svg>
		</span>
	);
};

export const StoreComponentIcon = ({ style }: IConProps) => {
	return (
		<span title="存储组件" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M652.736 64a192 192 0 01137.792 58.304l115.264 118.848A192 192 0 01960 374.912V768a192 192 0 01-192 192H256A192 192 0 0164 768V256A192 192 0 01256 64zm-31.04 544H402.304c-65.024 0-109.632 38.848-113.92 104.064l-.384 10.56V896h448V722.56c0-67.904-41.408-110.208-104.192-114.24l-10.112-.32zm-192-307.968c-73.28 0-135.744-46.016-141.312-108.288l-.384-8.96V128h-32a128 128 0 00-127.68 118.4L128 256v512a128 128 0 0096 123.968V722.624c0-103.808 69.888-173.312 166.976-178.304l11.328-.32h219.392c99.136 0 172.672 65.664 177.984 166.784l.32 11.84.064 169.344A128 128 0 00896 768V374.848a128 128 0 00-36.096-89.088L744.576 166.848a128 128 0 00-8.512-8L736 182.72c0 63.808-59.2 112.704-131.328 117.056v.256H429.696zM540.672 128H352v54.72c0 25.6 28.992 49.92 68.992 52.992l8.704.32h110.976V128zm112 0h-48v107.52c36.352-3.328 63.168-24.192 66.88-47.36l.448-5.44v-53.248A128 128 0 00652.8 128z"
				/>
			</svg>
		</span>
	);
};

export const ComputeComponentIcon = ({ style }: IConProps) => {
	return (
		<span title="计算组件" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M768 64a192 192 0 01192 192v512a192 192 0 01-192 192H256A192 192 0 0164 768V256A192 192 0 01256 64zm0 64H256a128 128 0 00-128 128v512a128 128 0 00128 128h512a128 128 0 00128-128V256a128 128 0 00-128-128zm0 585.216a32 32 0 015.76 63.488l-5.76.512H576a32 32 0 01-5.76-63.488l5.76-.512h192zM305.28 577.28l4.416 3.712 45.248 45.248 43.2-43.2a32 32 0 0148.96 40.768l-3.712 4.48-43.2 43.2 45.248 45.248a32 32 0 01-40.832 48.96l-4.416-3.712-45.248-45.248-47.296 47.296a32 32 0 01-48.96-40.832l3.712-4.48 47.296-47.232-45.248-45.248a32 32 0 0140.832-48.96zm462.72 8a32 32 0 015.76 63.488l-5.76.512H576a32 32 0 01-5.76-63.488l5.76-.576h192zM352 228.352a32 32 0 0131.488 26.24l.512 5.76v61.056h64a32 32 0 015.76 63.552l-5.76.512-64-.064v66.944a32 32 0 01-63.488 5.76l-.512-5.76v-66.944h-64a32 32 0 01-5.76-63.424l5.76-.512 64-.064v-61.056a32 32 0 0132-32zm416 93.12a32 32 0 015.76 63.488l-5.76.512H576a32 32 0 01-5.76-63.488l5.76-.512h192z"
				/>
			</svg>
		</span>
	);
};

export const DataSourceLinkSuccess = ({ style }: IConProps) => {
	return (
		<span title="连接成功" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M790.572 420.517l-.731.731c-44.612 46.074-150.655 76.06-269.863 76.06h-16.82c-116.282 0-221.594-29.986-269.131-75.328l-.731-1.463v-97.999l5.119 2.926c37.298 20.477 138.222 69.476 277.907 69.476 149.192 0 243.534-54.118 268.4-70.208l5.85-3.656v99.461z"
				/>
				<path
					fill="currentColor"
					d="M511.934 331.294c-151.386 0-278.638-54.85-278.638-89.954 0-34.372 130.177-91.417 277.906-91.417 149.924 0 279.37 61.433 279.37 91.417 0 30.716-126.52 89.954-278.638 89.954zm103.85 231.102c-2.195 1.463-3.657 2.194-5.12 4.388l-.731.731a13.164 13.164 0 00-5.12 3.657c-33.641 28.522-60.7 65.089-76.059 107.506-.73 1.463-.73 2.194-.73 3.657-1.464 1.462-1.464 2.194-1.464 3.656h-22.67c-117.014 0-223.058-29.984-269.863-75.327l-.731-.731V481.218l6.582 12.432c10.97 19.015 38.76 36.567 77.521 49 62.895 19.015 127.252 27.79 193.803 27.06h8.045c32.91 0 65.089-2.195 96.536-7.314zm174.788-85.566v37.298c-7.313-1.463-15.358-1.463-22.671-1.463h-2.194c.731 0 .731-.731 1.462-.731h.732c7.313-6.582 12.432-13.164 15.358-19.746l7.313-15.358zM534.605 873.213c-4.388.731-8.776.731-13.895.731h-16.82c-117.014 0-223.058-29.253-269.863-74.596l-.731-1.463V668.44l6.582 13.896c9.507 18.283 36.566 35.835 77.521 48.999 59.97 18.283 122.133 27.79 185.759 27.79h8.776v8.045c0 38.03 8.044 73.865 22.671 106.044z"
				/>
				<path
					fill="#fff"
					d="M722.558 434.412c-27.79 21.94-70.94 23.403-81.91 23.403h-2.193a22.525 22.525 0 01-21.21-22.671c0-11.702 10.24-21.209 21.94-21.209h1.464c11.7 0 40.223-2.194 55.581-13.895 9.507-7.314 23.403-5.851 30.716 3.656s5.12 23.403-4.388 30.716z"
				/>
				<path
					fill="currentColor"
					d="M1023.868 767.17c0 142.61-114.088 256.698-256.699 256.698a251.067 251.067 0 01-124.326-32.91 205.505 205.505 0 01-54.85-41.686c-11.702-10.97-21.94-22.672-29.985-35.836l-10.97-17.552c-2.194-2.194-2.925-4.388-3.657-6.582a68.745 68.745 0 01-8.776-16.09c-14.627-32.178-22.671-68.013-22.671-106.043v-8.044c.731-25.597 5.12-49.731 13.895-73.134v-.731c.731-2.925 1.463-5.85 2.925-8.776 3.657-10.239 8.045-19.746 13.165-29.253 0-.732.73-1.463.73-1.463 4.389-8.776 10.24-17.552 16.09-26.328 4.388-5.85 8.045-10.97 13.164-16.09 3.657-5.119 8.045-10.238 12.433-14.626 8.045-8.045 16.82-15.358 25.597-22.671 1.462-1.463 3.656-2.926 5.119-3.657.731-.731.731-.731 1.463-.731 5.119-3.657 10.238-7.314 16.089-10.97 10.97-7.314 22.671-13.164 34.373-18.284 29.984-13.164 62.894-19.746 97.998-20.477h2.926c8.044 0 15.358 0 22.671 1.462 10.239.732 21.209 2.194 30.716 4.388 12.433 2.926 24.865 5.851 36.567 10.97 8.776 2.926 16.09 6.583 24.134 10.24 3.656 1.462 7.313 3.656 10.239 5.85 8.776 4.388 16.82 9.507 25.596 15.358 36.567 26.328 65.82 61.432 83.372 103.118 14.627 31.447 22.672 67.283 22.672 103.85z"
				/>
				<path
					fill="#fff"
					d="M902.466 701.35l-159.43 159.43c-3.657 3.657-8.045 5.12-13.165 5.12s-9.507-1.463-13.164-5.12l-84.103-84.103a18.54 18.54 0 010-26.328 18.54 18.54 0 0126.328 0l70.94 70.94L876.137 675.02a18.54 18.54 0 0126.328 0 18.54 18.54 0 010 26.328z"
				/>
			</svg>
		</span>
	);
};

export const DataSourceLinkFailed = ({ style }: IConProps) => {
	return (
		<span title="连接失败" style={style}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M790.207 420.323a407.896 407.896 0 01-269.737 73.1h-17.544a421.785 421.785 0 01-269.007-73.1V322.37h5.117a584.797 584.797 0 00277.779 73.1 502.195 502.195 0 00268.276-73.1l5.847-3.655z"
				/>
				<path
					fill="currentColor"
					d="M511.698 331.142c-151.317 0-278.51-54.825-278.51-89.913s132.31-91.375 278.51-91.375 279.24 61.404 279.24 91.375-127.193 89.913-279.24 89.913zm103.801 230.995a14.62 14.62 0 00-5.117 4.385 13.158 13.158 0 00-5.117 0 255.849 255.849 0 00-73.1 107.457 6.579 6.579 0 000 3.655 4.386 4.386 0 000 3.655h-28.508a421.054 421.054 0 01-269.738-73.1V480.996l6.579 12.427a137.427 137.427 0 0077.486 48.977 639.622 639.622 0 00193.714 27.046h7.31a599.417 599.417 0 0096.491-7.31zm174.708-85.527v35.088a118.421 118.421 0 00-22.66 0 60.673 60.673 0 0015.35-19.737zM534.36 872.81h-30.702a421.785 421.785 0 01-269.738-73.1V668.131l6.579 13.889a131.58 131.58 0 0076.755 48.977 634.505 634.505 0 00185.673 27.778h8.772v8.04a255.118 255.118 0 0022.66 105.995z"
				/>
				<path
					fill="#FFF"
					d="M722.225 434.212a146.2 146.2 0 01-81.872 23.392 22.66 22.66 0 01-23.392-19.006 21.93 21.93 0 0121.93-21.199 105.995 105.995 0 0055.556-13.889 21.93 21.93 0 1126.316 34.357z"
				/>
				<path
					fill="currentColor"
					d="M1023.395 766.816a255.849 255.849 0 01-256.58 256.58 250.732 250.732 0 01-104.532-22.661 127.193 127.193 0 01-19.737-10.234 205.41 205.41 0 01-57.749-40.205 173.246 173.246 0 01-29.97-35.82l-10.965-17.543a14.62 14.62 0 01-3.655-6.579 68.714 68.714 0 01-8.772-16.082 255.118 255.118 0 01-19.737-107.456v-8.041a223.685 223.685 0 0113.889-73.1 40.936 40.936 0 010-8.772 209.796 209.796 0 0113.158-29.24 254.387 254.387 0 0116.082-26.316 140.351 140.351 0 0113.157-16.082 119.152 119.152 0 0116.813-16.813c8.041-8.04 16.813-15.35 25.585-22.66h5.117l16.082-10.965a219.299 219.299 0 0134.357-18.275 255.118 255.118 0 0198.685-24.854 114.035 114.035 0 0122.66 0 206.872 206.872 0 0130.702 4.386 210.527 210.527 0 0136.55 10.965 239.036 239.036 0 0124.123 10.234l10.234 5.848a236.843 236.843 0 0125.585 15.35 244.153 244.153 0 0183.334 103.071 247.808 247.808 0 0125.584 105.264z"
				/>
				<path
					fill="#FFF"
					d="M661.725 667.074q12.923-12.922 25.845 0l180.913 180.913q12.922 12.922 0 25.844-12.923 12.923-25.845 0L661.725 692.92q-12.922-12.922 0-25.845z"
				/>
				<path
					fill="#FFF"
					d="M868.789 667.539q12.922 12.923 0 25.845L687.877 874.297q-12.923 12.922-25.845 0-12.922-12.923 0-25.845l180.912-180.913q12.923-12.922 25.845 0z"
				/>
			</svg>
		</span>
	);
};

export const SyntaxIcon = ({ style }: IConProps) => {
	return (
		<span title="语法检查" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M259.413 677.376l46.08-126.976h212.224l46.08 127.019h88.747L458.837 170.667h-94.464L170.667 677.376h88.746zm233.472-195.157h-162.56l80.214-222.123h2.858l79.488 222.123z"
				/>
				<path
					fill="currentColor"
					d="M831.019 588.203a32 32 0 0145.226 45.013l-3.328 3.413L578.22 891.563a32 32 0 01-41.43.384l-3.37-3.286-105.515-118.016a32 32 0 0144.288-45.952l3.413 3.286 84.523 94.549 270.933-234.325z"
				/>
			</svg>
		</span>
	);
};

export const FlinkIcon = ({ style }: IConProps) => {
	return (
		<span title="Flink" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="#E06810"
					d="M64 0h896q64 0 64 64v896q0 64-64 64H64q-64 0-64-64V64Q0 0 64 0z"
				/>
				<path
					fill="#FFF"
					d="M224.512 704V547.84c0-55.808-1.024-109.568-5.12-163.84h5.12l77.824 320H377.6l76.288-320h5.12a1946.112 1946.112 0 00-5.632 163.84V704h84.48V304.64h-135.68L364.8 462.848a892.992 892.992 0 00-19.456 135.68h-5.12a873.152 873.152 0 00-21.504-136.192l-38.4-157.696H140.032V704h84.48zm487.424 0V558.08h38.4L810.24 704h107.008l-86.016-175.104c39.424-16.896 64-50.176 64-107.008 0-79.872-58.368-117.248-140.8-117.248H619.776V704h92.16zm32.768-214.016h-32.768V371.2h32.768c36.352 0 58.368 19.456 58.368 60.416 0 42.496-22.016 58.368-58.368 58.368z"
				/>
			</svg>
		</span>
	);
};

export const OceanBaseIcon = ({ style }: IConProps) => {
	return (
		<span title="OceanBase" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="#2B85FB"
					d="M403.456 721.408h2.048l92.672 160.768H323.584c-16.384 0-35.328-11.264-43.52-25.088L91.648 530.432c-8.192-13.824-8.192-36.352 0-50.176L280.064 153.6c8.192-13.824 27.648-25.088 43.52-25.088h172.032l-92.16 159.232c-16.384 0-29.184 13.312-29.184 29.184 0 5.12 1.536 10.24 4.096 14.848L294.4 476.16c-15.872 0-29.184 12.8-29.184 29.184 0 15.872 12.8 29.184 29.184 29.184h2.56l82.432 142.336c-9.216 13.312-5.632 31.232 7.68 40.448 4.608 2.56 10.24 4.096 16.384 4.096zm212.992-56.32s-.512 0 0 0l-81.92-141.312c2.56-3.072 4.608-7.168 5.632-11.264h162.304c0 1.536.512 3.072 1.536 4.096l-14.848 25.6L618.496 665.6c-.512-.512-1.536 0-2.048-.512zm316.416-185.344c8.192 13.824 8.192 36.352 0 50.176L744.448 856.576c-8.192 13.824-27.648 25.088-43.52 25.088H531.456l-97.28-168.96H599.04c5.12 6.144 13.312 9.728 21.504 9.728 15.872 0 28.672-12.8 28.672-29.184 0-4.096-1.024-8.192-2.56-11.776l84.992-147.968c15.36-1.024 27.136-13.824 27.136-29.184s-11.264-27.648-26.112-29.184l-85.504-148.48c5.632-14.848-1.536-31.744-16.384-37.376-3.584-1.536-7.168-2.048-10.752-2.048a29.184 29.184 0 00-28.16 20.992H431.104c-.512-2.56-1.536-5.12-3.072-7.168l100.352-174.08h171.52c16.384 0 35.328 11.264 43.52 25.088l189.44 327.68zm-530.432 184.32l-83.456-143.872 1.536-3.072c.512-1.024.512-2.048 1.024-2.56v-.512c.512-1.024.512-1.536.512-2.56v-.512c.512-1.024.512-2.048.512-3.072v-.512c.512-4.096 0-8.192-1.536-12.288-.512-1.536-1.536-3.072-2.56-5.12v-.512l83.968-144.896c3.584 0 7.168-.512 10.24-2.048l80.384 138.752c-6.656 5.632-10.752 13.312-10.752 22.528 0 6.656 2.56 13.312 6.656 18.432v.512L408.064 663.04c-1.024 1.536-3.072 1.024-5.632 1.024zm24.576 12.8c-1.536-2.048-3.072-4.096-5.12-6.144l-.512-.512 79.872-138.24c1.536.512 3.072 1.024 5.12 1.536 1.536.512 3.584.512 5.632.512h3.072c2.56-.512 5.12-1.024 7.68-2.048 1.024-.512 1.536-.512 2.56-1.024l80.896 138.24c-5.632 3.584-9.728 8.704-12.288 14.848H430.592c-1.024-2.56-2.048-5.12-3.584-7.168zM689.664 458.24l17.408 30.208c-2.048 3.072-3.584 6.144-4.608 9.728l-162.304-.512c-1.536-6.144-5.12-11.776-10.24-15.872l-1.024-1.024c-6.144-4.608-13.824-6.144-21.504-4.608l-81.92-141.312s0-.512.512-.512c.512-.512 1.024-1.536 1.536-2.048 1.536-2.56 3.072-5.632 3.584-8.704v-.512h161.28c3.072 13.312 14.848 22.528 28.672 22.528h4.096l64.512 112.64z"
				/>
			</svg>
		</span>
	);
};

export const VirtualIcon = ({ style }: IConProps) => {
	return (
		<span title="虚节点" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="#2491F7"
					d="M944 80v864H80V80h864m18.003-80H61.997C27.757 0 0 27.757 0 61.997v900.006C0 996.243 27.757 1024 61.997 1024h900.006c34.24 0 61.997-27.757 61.997-61.997V61.997C1024 27.757 996.243 0 962.003 0z"
				/>
				<path
					fill="#2491F7"
					d="M890.811 662.627c-7.173 7.173-15.541 12.851-25.104 17.035-9.564 4.184-19.725 6.276-30.484 6.276-9.564 0-18.53-1.495-26.897-4.483-8.368-2.988-15.84-7.173-22.415-12.552a107.26 107.26 0 01-11.656-11.656l-.897-.897c-5.379-7.173-9.564-14.943-12.552-23.311-1.793-4.184-2.988-8.368-3.586-12.552-.598-4.184-.897-8.667-.897-13.449v-5.38l-179.319-75.314c-.598 0-.897.299-.897.897l-.897.897c-8.368 8.368-18.231 14.943-29.587 19.725-4.184 1.793-8.667 3.288-13.449 4.483l-17.035 206.216c9.564 4.184 17.932 9.713 25.104 16.587 7.173 6.874 12.851 15.242 17.035 25.104 4.184 9.862 6.276 20.174 6.276 30.933s-2.092 20.921-6.276 30.484c-4.184 9.564-9.862 17.932-17.035 25.104-7.173 7.173-15.541 12.851-25.104 17.035-9.564 4.184-19.725 6.276-30.484 6.276-9.564 0-18.53-1.495-26.897-4.483a65.985 65.985 0 01-22.415-13.449 207.118 207.118 0 01-11.656-10.759l-.897-.897c-5.379-7.173-9.564-14.943-12.552-23.311-.598-1.793-1.195-3.885-1.793-6.276a210.139 210.139 0 00-1.793-6.725c-.598-2.092-.897-4.334-.897-6.725v-6.276c0-10.759 2.092-21.07 6.276-30.933 4.184-9.862 9.713-18.231 16.587-25.104s15.391-12.403 25.553-16.587l17.935-212.491a117.656 117.656 0 01-18.828-10.759 276.47 276.47 0 01-12.552-13.449l-.897-.897-.897-.897-173.043 39.45-1.793 7.173c-.598 2.391-1.495 4.781-2.69 7.173-4.184 9.564-9.862 17.782-17.035 24.657-7.173 6.874-15.541 12.403-25.104 16.587-9.564 4.184-19.725 6.276-30.484 6.276-2.988 0-5.978-.149-8.966-.448-2.988-.298-5.978-.747-8.966-1.345s-5.978-1.495-8.966-2.69c-8.368-2.988-15.84-7.173-22.415-12.552a107.26 107.26 0 01-11.656-11.656l-.897-.897c-5.379-6.575-9.564-14.047-12.552-22.415-1.793-4.184-2.988-8.518-3.586-13.001s-.895-9.115-.895-13.896c0-10.161 2.092-20.174 6.276-30.036s9.713-18.38 16.587-25.553 15.242-12.851 25.104-17.035c9.862-4.184 20.174-6.276 30.933-6.276s20.921 2.092 30.484 6.276c9.564 4.184 17.932 9.862 25.104 17.035 3.586 3.586 6.874 7.771 9.862 12.552l164.973-36.76a164.237 164.237 0 012.69-17.484 150.291 150.291 0 014.483-16.587 275.113 275.113 0 017.173-13.449l-132.7-147.936c-8.966 3.586-18.231 5.38-27.794 5.38-8.966 0-17.633-1.495-26.001-4.483-8.368-2.988-16.138-7.471-23.311-13.449a103.765 103.765 0 00-5.828-5.38 103.382 103.382 0 01-5.828-5.379l-.897-1.793c-5.379-6.575-9.564-14.047-12.552-22.415-2.988-8.368-4.483-17.334-4.483-26.897 0-10.161 2.092-20.174 6.276-30.036 4.184-9.862 9.862-18.38 17.035-25.553 7.173-7.173 15.541-12.851 25.104-17.035 9.564-4.184 19.725-6.276 30.484-6.276s21.07 2.092 30.933 6.276 18.231 9.862 25.104 17.035c6.874 7.173 12.403 15.691 16.587 25.553 4.184 9.862 6.276 19.874 6.276 30.036 0 10.759-2.092 21.219-6.276 31.38v.897l136.282 152.421a246.122 246.122 0 0114.345-3.138 77.646 77.646 0 0114.345-1.345c11.954 0 23.611 2.391 34.967 7.173l2.69.897 85.176-115.66a149.25 149.25 0 01-6.276-14.345c-2.988-8.368-4.483-17.035-4.483-26.001 0-10.759 2.092-21.07 6.276-30.933 4.184-9.863 9.713-18.231 16.587-25.104 6.874-6.874 15.242-12.403 25.104-16.587 9.862-4.184 20.174-6.276 30.933-6.276s20.921 2.092 30.484 6.276 17.932 9.713 25.104 16.587c7.173 6.874 12.851 15.242 17.035 25.104 4.184 9.862 6.276 20.174 6.276 30.933s-2.092 20.921-6.276 30.484c-4.184 9.564-9.862 17.932-17.035 25.104-7.173 7.173-15.541 12.851-25.104 17.035-9.564 4.184-19.725 6.276-30.484 6.276h-4.483c-1.195 0-2.391-.149-3.586-.448a14.728 14.728 0 00-3.586-.448c-1.195 0-2.54-.149-4.035-.448-1.495-.299-2.839-.747-4.035-1.345l-89.659 122.832c.598 1.793 1.195 3.288 1.793 4.483 4.781 11.357 7.173 23.013 7.173 34.967v7.173l182.008 76.211c5.978-5.379 12.851-9.564 20.621-12.552 10.161-4.184 20.621-6.276 31.38-6.276s20.921 2.092 30.484 6.276c9.564 4.184 17.932 9.713 25.104 16.587 7.173 6.874 12.851 15.242 17.035 25.104 4.184 9.862 6.276 20.174 6.276 30.933v16.138l-6.276 14.345c-4.18 9.563-9.858 17.93-17.031 25.103z"
				/>
			</svg>
		</span>
	);
};

export const WorkflowIcon = ({ style }: IConProps) => {
	return (
		<span title="虚节点" style={{ fontSize: 0, ...style }}>
			<svg
				xmlns="http://www.w3.org/2000/svg"
				width="1em"
				height="1em"
				className="icon"
				viewBox="0 0 1024 1024"
			>
				<path
					fill="currentColor"
					d="M422 684h360c19.882 0 36 16.118 36 36v140c0 19.882-16.118 36-36 36H422c-19.882 0-36-16.118-36-36V720c0-19.882 16.118-36 36-36zm36 72v68h288v-68H458zM242 128h360c19.882 0 36 16.118 36 36v140c0 19.882-16.118 36-36 36H242c-19.882 0-36-16.118-36-36V164c0-19.882 16.118-36 36-36zm36 72v68h288v-68H278z"
				/>
				<path
					fill="currentColor"
					d="M178 476c-19.683 0-35.677 15.797-35.995 35.405L142 512v278c0 19.683 15.797 35.677 35.405 35.995L178 826h142c19.882 0 36-16.118 36-36 0-19.683-15.797-35.677-35.405-35.995L320 754H214V548h204.68c19.684 0 35.678-15.797 35.995-35.405l.005-.595c0-19.683-15.797-35.677-35.404-35.995l-.596-.005H178zm526-278c-19.882 0-36 16.118-36 36 0 19.683 15.797 35.677 35.405 35.995L704 270h106v206H603.037c-19.683 0-35.677 15.797-35.995 35.405l-.005.595c0 19.683 15.797 35.677 35.405 35.995l.595.005H846c19.683 0 35.677-15.797 35.995-35.405L882 512V234c0-19.683-15.797-35.677-35.405-35.995L846 198H704z"
				/>
				<path
					fill="currentColor"
					d="M534.749 394.274l111 90c17.77 14.408 17.77 41.52 0 55.927l-111 90c-13.216 10.716-32.13 10.716-45.346 0l-111-90c-17.77-14.408-17.77-41.519 0-55.927l111-90c13.216-10.715 32.13-10.715 45.346 0zm-22.673 74.309l-53.839 43.654 53.839 43.654 53.84-43.654-53.84-43.654z"
				/>
			</svg>
		</span>
	);
};
